<template>
	<view class="box screen-all flex">
		<head-navigation></head-navigation>
		<scroll-view class="screen-all" scroll-y>
			<image class="bg" src="../../static/darenbg.png"></image>
			<view class="title-view flex row center">
				<view class="line-h"></view>
				<text class="title">申请信息</text>
				<view class="line-h"></view>
			</view>
			<view class="input-view flex center">
				<input class="input-w" v-model="name" placeholder="请输入您的姓名"/>
				<input class="input-w" v-model="phone" placeholder="请输入您的联系电话" type="number"/>
			</view>
			<view class="sub-btn flex center" @click="submit()">
				提交申请
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: "",
				phone: "",
			}
		},
		methods: {
			submit () {
				if (!this.name) {
					uni.showToast({ title: '请输入姓名', icon: 'none' })
					return ;
				}
				if (!this.phone) {
					uni.showToast({ title: '请输入电话', icon: 'none' })
					return ;
				}
				
				uni.showToast({ title: '提交中...', icon: 'loading', duration: 10000 });
				
				let params = {
					token: uni.getStorageSync("token"),
					mobile: this.phone,
					truename: this.name,
				}
				console.log(params);
				this.$request("api/Talent/confirm", params)
					.then(({ code, msg, data, time }) => {
						console.log(code, msg, data);
						uni.hideToast();
						if(code == 1){
							this.phone = '';
							this.name = '';
							uni.showToast({ title: msg, icon: 'success', duration: 5500 });
						}else{
							uni.showToast({ title: msg, icon: 'error', duration: 3500 });
						}
					}).catch((e) => {
						uni.hideToast();
						console.log(e);
					});
			},
		}
	}
</script>

<style>
	.box {
		background-color: #010B24;
	}
	.bg {
		width: 750rpx;
	}
	.line-h {
		width: 38rpx;
		height: 4rpx;
		border-radius: 2rpx;
		background-color: #FFFFFF;
	}
	.title {
		font-size: 28rpx;
		color: #FFF;
		margin: 0 20rpx;
	}
	.title-view {
		margin: 22rpx 0;
	}
	.input-view {
		width: 100%;
	}
	.input-w {
		font-size: 30rpx;
		color: #FFF;
		width: 675rpx;
		height: 110rpx;
		border: 1rpx solid #323550;
		border-radius: 20rpx;
		padding: 0 26rpx;
		margin-top: 38rpx;
		box-sizing: border-box;
	}
	.sub-btn {
		width: 680rpx;
		height: 104rpx;
		background-color: #B157F6;
		border-radius: 52rpx;
		font-size: 30rpx;
		color: #FFF;
		margin-top: 160rpx;
		margin-left: 35rpx;
	}
	.sub-btn:active {
		background-color: #B157F6EE;
	}
</style>
